<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>清除setInterval定时器</title>
</head>
<body>
  <button class="begin">开启定时器</button>
  <button class="stop">停止定时器</button>
  <script>
    var begin = document.querySelector('.begin')
    var stop = document.querySelector('.stop')
    var timer = null // 全局变量  null是一个空对象
    begin.addEventListener('click', function () {
      timer = setInterval(function () {
        console.log('ni hao ma')
      }, 1000)
    })
    stop.addEventListener('click', function () {
      clearInterval(timer)
    })
  </script>
</body>
</html>